<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta content="text/html;charset=UTF-8"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
	<meta http-equiv ="Pragma" content = "no-cache"/>
	<meta http-equiv="Cache-Control" content="no cache" />
	<meta http-equiv="Expires" content="0" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
	<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
	<meta name="apple-mobile-web-app-capable" content="yes"/>
	<meta name="format-detection" content="telephone=no"/>

	<script src="../js/jquery-1.9.1.min.js"></script>
	<link rel="stylesheet" type="text/css" href="../plugins/layui/css/layui.css" media="all"/>
	<link rel="stylesheet" type="text/css" href="../css/fs.css" media="all"/>
	<script type="text/javascript" src="../plugins/layui/layui.js"></script>
	<script src="../js/tools.js"></script>
	<!-- formSelects-->
	<link rel="stylesheet" href="../plugins/formSelects-v4/formSelects-v4.css" media="all">
	<script src="../plugins/formSelects-v4/formSelects-v4.js" type="text/javascript" charset="utf-8"></script>
	<!--inputTags-->
	<link rel="stylesheet" type="text/css" href="../plugins/addTag/jquery.tagsinput.css" media="all"/>
	<script type="text/javascript" src="../plugins/addTag/jquery.tagsinput.js"></script>
</head>
<body>
   <div class="layui-fluid">
  	<div class="layui-row layui-col-space1">
		 <div class="layui-col-md12">
			 <blockquote style="margin-top: 10px;margin-left: 5px;margin-right: 5px;" class="layui-elem-quote news_search">
				<div class="demoTable">
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-mid">关键词：</label>
							<div class="layui-input-inline" style="width: 300px;">
								<input type="tel" id="selectname" name="selectname" autocomplete="off" placeholder="用户名/姓名/电话号码" class="layui-input"/>
							</div>
						</div>

						<div class="layui-inline">
							<div class="layui-input-inline">
								<button class="layui-btn" data-type="reload"><i class="layui-icon">&#xe615;</i>查询</button>
							</div>
						</div>
					</div>
				</div>
			 </blockquote>
		 </div>
			 <div class="layui-col-md12">
				<div class="layui-row grid-demo">
					<div class="layui-col-md12">
						<blockquote>
							<div class="layui-btn-group demoTable">
								<button id="add" class="layui-btn"  >
									<i class="layui-icon">&#xe654;</i>新增
								</button>
								<button class="layui-btn layui-btn-danger" data-type="getCheckData">
									<i class="layui-icon">&#xe640;</i>批量删除
								</button>
							</div>
						</blockquote>
					</div>
				  <div class="layui-col-md12">

					  <table class="layui-hide" lay-filter="demo" id="table"></table>

					  <script type="text/html" id="barDemo">
						  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
						  <a class="layui-btn layui-btn-xs" lay-event="pwd">修改密码</a>
					  </script>
				  </div>
				</div>
			 </div>
  </div>
</div>

  <!--新增窗口-->
  <div style="display: none;margin-top: 20px;" id="meanAdd">
	  <form id="manager" class="layui-form" action="" lay-filter="add">
		  <div class="layui-form-item">
			  <label class="layui-form-label">用户名<SPAN style="color: red">*</SPAN></label>
			  <div style="width:600px;" class="layui-input-inline">

				  <input type="text"  name="userName"  lay-verify="required|title" autocomplete="off" placeholder="请输入用户名" class="layui-input">
			  </div>
		  </div>

		  <div class="layui-form-item">
			  <label class="layui-form-label">密码<SPAN style="color: red">*</SPAN></label>
			  <div style="width:600px;" class="layui-input-inline">

				  <input type="password" name="password" lay-verify="required|pass" placeholder="请输入密码" autocomplete="off" class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <label class="layui-form-label">真实姓名</label>
			  <div style="width:600px;" class="layui-input-inline">
				  <input type="text"  name="realName"  autocomplete="off" placeholder="请输入真实姓名" class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <label class="layui-form-label">电话号码</label>
			  <div style="width:600px;" class="layui-input-inline">
				  <input type="tel" name="mobileNumber"  autocomplete="off" class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <label class="layui-form-label">绑定的app用户ID:</label>
			  <div style="width: 450px"  class="layui-input-block">
				  <input type="number" id="newUserId"    name="userId"   class="layui-input">

			  </div>
		  </div>
		  <div class="layui-form-item">
			  <div class="layui-inline">
				  <label class="layui-form-label">性别</label>

				  <div class="layui-input-block">
					  <select name="sex"  >
						  <option value="1">男</option>
						  <option value="0">女</option>
					  </select>
				  </div>
			  </div>
		  </div>


		  <div class="layui-form-item">
			  <label class="layui-form-label">备注<SPAN style="color: red">*</SPAN></label>
			  <div style="width:600px;" class="layui-input-inline">
				  <textarea name="remake" placeholder="请输入内容" class="layui-textarea"></textarea>
			  </div>
		  </div>
		  <div  class="layui-form-item">
			  <div  class="layui-input-block">
				  <button style="width: 200px;" class="layui-btn" lay-submit="" lay-filter="addAndUpdate">保存</button>
			  </div>
		  </div>
	  </form>
  </div>
  <!--新增窗口-->
  <!--修改密码窗口-->
  <div style="display: none; margin-top:30px" id="updatePassword">
	  <form class="layui-form" action="" lay-filter="password">
		  <div class="layui-form-item">
			  <label class="layui-form-label">用户名:</label>
			  <input type="hidden" id="passwordId" name="id">
			  <div class="layui-input-inline">
				  <input type="text" style="border: 0px" disabled name="userName"    class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <label class="layui-form-label">新密码</label>
			  <div class="layui-input-inline">
				  <input type="password"  name="newPassword" lay-verify="required" autocomplete="off" placeholder="请输入新的密码" class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <div class="layui-input-block">
				  <button class="layui-btn" lay-submit="" lay-filter="subPassword">立即提交</button>
			  </div>
		  </div>
	  </form>
  </div>
  <!--修改密码窗口-->
  <!--更新窗口-->
  <div style="display: none;margin-top: 20px;" id="update">
	  <form id="managerUpdate" class="layui-form" action="" lay-filter="add">
		  <div class="layui-form-item">
			  <label class="layui-form-label">用户名<SPAN style="color: red">*</SPAN></label>
			  <div style="width:600px;" class="layui-input-inline">
				  <input type="hidden" id="meanId" name="id">
				  <input type="text"  name="userName"  lay-verify="required|title" autocomplete="off" placeholder="请输入用户名" class="layui-input">
			  </div>
		  </div>

		  <div class="layui-form-item">
			  <label class="layui-form-label">真实姓名</label>
			  <div style="width:600px;" class="layui-input-inline">
				  <input type="text"  name="realName"   autocomplete="off" placeholder="请输入真实姓名" class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <label class="layui-form-label">电话号码</label>
			  <div style="width:600px;" class="layui-input-inline">
				  <input type="tel" name="mobileNumber"  autocomplete="off" class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <label class="layui-form-label">绑定的app用户ID:</label>
			  <div style="width: 450px"  class="layui-input-block">
				  <input type="text"    id="updateUserId"  name="userId"  class="layui-input">
			  </div>
		  </div>
		  <div class="layui-form-item">
			  <div class="layui-inline">
				  <label class="layui-form-label">性别</label>

				  <div class="layui-input-block">
					  <select name="sex"  >
						  <option value="1">男</option>
						  <option value="0">女</option>
					  </select>
				  </div>
			  </div>
		  </div>


		  <div class="layui-form-item">
			  <label class="layui-form-label">备注<SPAN style="color: red">*</SPAN></label>
			  <div style="width:600px;" class="layui-input-inline">
				  <textarea name="remake" placeholder="请输入内容" class="layui-textarea"></textarea>
			  </div>
		  </div>
		  <div  class="layui-form-item">
			  <div  class="layui-input-block">
				  <button style="width: 200px;" class="layui-btn" lay-submit="" lay-filter="addAndUpdate">保存</button>
			  </div>
		  </div>
	  </form>
  </div>
  <!--更新窗口-->
  <script>
      layui.use(['form','layer','table'], function () {
          var $ = layui.jquery;
          var table = layui.table;
          var form = layui.form;
          var layer = layui.layer;
          //监听表格复选框选择
          table.on('checkbox(demo)', function(obj){
              console.log(obj)
          });
          //监听工具条
          table.on('tool(demo)', function(obj){
              var data = obj.data;
              if(obj.event === 'edit'){
                  $('input[name="id"]').val(data.id);
                  $('#manager')[0].reset()
                  $.ajax({
                      url:"/managerController/detail",
                      type:"POST",
                      data:{id:data.id},
                      dataType:"json",
                      success:function (data) {
                          $("input[name='userName']").val(data.manager.userName)
                          $("input[name='realName']").val(data.manager.realName)
                          $("input[name='mobileNumber']").val(data.manager.mobileNumber)
                          $("select[name='realName']").val(data.manager.sex)
                          $("textarea[name='remake']").val(data.manager.remake)

                          if (data.manager.userId != null && data.manager.userId != ""){
                              $('#updateUserId').importTags(data.manager.userId)
                          }else {
                              $('#updateUserId').importTags("")
                          }
                          form.render();
                          layer.open({
                              type: 1,
                              title:"管理员编辑",
                              area:['800px', '600px'],
                              content: $('#update')
                          });
                      }
                  })
              }
              else if(obj.event === 'pwd'){
                  $('input[name="userName"]').val(data.userName)
                  $("#passwordId").val(data.id)
                  var  width=($(window).width()*0.3);
                  var height=($(window).height()*0.55);
                  layer.open({
                      type: 1,
                      closeBtn: 1,
                      area: [width + 'px', height + 'px'],//大小
                      content: $("#updatePassword"),
                      skin: "layui-layer-molv",
                      title: "密码修改"
                  })

			  }
          });


          $('#add').click(function () {
              $('input[name="id"]').val("");
              $('#manager')[0].reset()
			  $('#pwd').show()

              layer.open({
                  type: 1,
                  title:"管理员新增",
                  area:['800px', '600px'],
                  content: $('#meanAdd') //注意，如果str是object，那么需要字符拼接。
              });


          })
          //方法级渲染
          table.render({
              elem: '#table' //指定原始表格元素选择器（推荐id选择器）
              ,url: '/managerController/paramlist'
              ,height: "full-135" //容器高度
              ,page: true //开启分页
              ,limits: [10,15,20]
              ,limit:10
              ,skin: 'row' //行边框风格
              ,even: true //开启隔行背景
              ,cols: [
                  [
                      {type:'checkbox'},
                      {type:'numbers', title: '序'},

                      { field: 'userName', title: '用户名'},

                      { field: 'realName', title: '姓名'},

                      { field: 'mobileNumber', title: '电话号码'},

                      { field: 'sex', title: '性别',templet: function(d){
                          if(d.sex == 1){
                              return "男";
                          } else  if(d.sex == 0){
                              return "女";
                          } else{
								return "--"
						  }
                      }},

                      {field: 'createTime', title: '加入时间',templet: function(d){
                          if(isNull(d.createTime)){
                              return "--";
                          }
                          return getFormatDateByLong(d.createTime, "yyyy-MM-dd hh:mm");
                      }},
                      {field: null ,width:"25%", title: '操作',templet:"#barDemo" }
                  ]
              ]
              ,id: 'testReload'
              , done: function(res, curr, count){
                  sessionStorage.setItem("curr",curr)
                  if(res.code == -1){
                      top.location.href="/pageController/login"
                  }
              }

          });


          var $ = layui.$, active = {
              reload: function(){
                  var selectname = $('#selectname');
                  //执行重载
                  table.reload('testReload', {
                      where: {
                          name: selectname.val(),
                      }
                      ,page: {
                          curr: 1 //重新从第 1 页开始
                      }
                  });
              }
          };

          $('.demoTable .layui-btn').on('click', function(){
              var type = $(this).data('type');
              active[type] ? active[type].call(this) : '';
          });
          var $ = layui.$, active = {
              getCheckData: function(){ //获取选中数据
                  var checkStatus = table.checkStatus('testReload')
                      ,data = checkStatus.data;

                  if(data.length == 0){
                      layer.alert('请选择至少一条数据', {icon: 5});
                      return false
                  }
                  var json = JSON.stringify(data)
                  var ids =new Array();
                  $.each(eval(json),function (i,n) {
                      ids.push(n.id)
                  })
                  ids.join(',')
                  $.ajax({
                      url:"/managerController/delByIds?ids="+ids,
                      type:"POST",
                      dataType:"json",
                      success:function (data) {
                          if(data.ret ==0 || data.ret =="0"){
                              layer.alert('删除成功', {icon: 1}, function(index){
                                  layer.close(index);
                                  var curr = sessionStorage.getItem("curr");
                                  table.reload('testReload',{page:{curr:curr}});
                              });
                          }

                      }
                  })

              }

          };
          //提交新增与更新
          form.on('submit(addAndUpdate)', function(data){

              $.ajax({
                  url:"/managerController/addAndUpdate",
                  type:"POST",
                  data:data.field,
                  dataType:"json",
                  success:function(data){
                      if(data.code == -1){
                          top.location.href="/pageController/login"
                      }
                      if(data.ret == 0 || data.ret == "0"){
                          layer.alert('添加成功', {icon: 1}, function(index){
                              layer.closeAll("page");
                              layer.close(index);
                              var curr = sessionStorage.getItem("curr");
                              table.reload('testReload',{page:{curr:curr}});
                          });
                      } else if (data.ret ==14 ||data.ret == "14"){
                          layer.alert('更新成功', {icon: 1}, function(index){
                              layer.closeAll("page");
                              layer.close(index);
                              var curr = sessionStorage.getItem("curr");
                              table.reload('testReload',{page:{curr:curr}});
                          });
                      }
                      else if (data.ret =="15"||data.ret == 15){
                          layer.alert('更新失败', {icon: 5});
                      }
                      else if (data.ret == -1||data.ret == "-1"){
                          layer.alert('添加失败', {icon: 5});
                      }else if (data.ret == 020102||data.ret == "020102"){
                          layer.alert('app用户ID不存在,请重新输入', {icon: 5});
					  }
                  }
              })
              return false;
          });
          //提交修改密码
          form.on('submit(subPassword)', function(data){
              $.ajax({
                  url:"/managerController/updatePassword",
                  type:"POST",
                  data:data.field,
                  dataType:"json",
                  success:function (data) {
                      if(data.ret ==0){
                          layer.alert('修改密码成功', {icon: 1}, function(index){
                              layer.close(index);
                              var curr = sessionStorage.getItem("curr");
                              table.reload('testReload',{page:{curr:curr}});
                          });
                      }
                  }
              })
              return false;
          });

          $(function () {


          })
		  $(function () {
              $('#newUserId').tagsInput();
              $('#updateUserId').tagsInput();
          })
      });
  </script>
</body>
</html>
